<!doctype html>
<html lang="en">

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="lib/css/bootstrap.css">
    <link rel="stylesheet" href="css/index.css">

    <title></title>
    <link rel="shortcut icon" href="favicon.ico">
</head>

<body>
    <!-- -------------头部-begin------------- -->
    <header id="lk_header">

        <!-- 上部分 -->
        <div class="shortcut-nav border-bottom d-none d-md-none d-sm-none d-lg-block text-muted">
            <div class="container">
                <div class="row  text-center">
                    <div class="col-md-2 bd-item1 ">
                        <a href="#" class="text-muted">
                            <i class="icon-phone"></i>
                            <span>关注微信号</span>
                            <div class="erweima">
                                <img src="images/ewm_lk.jpg">
                            </div>
                        </a>

                    </div>
                    <div class="col-md-5">
                        <i class="icon-telphone"></i>
                        <span> 188-8888-8888（服务时间：9:00-21:00）</span>
                    </div>
                    <div class="col-md-2">
                        <span>校企合作 培训师</span>
                    </div>
                    <div class="col-md-3">
                        <a href="#" class="text-muted btn  btn-sm h-current">免费注册</a>
                        <a href="#" class=" text-muted">立即登录</a>
                    </div>
                </div>
            </div>

        </div>
        <!-- 下部分 -->
        <nav class="navbar navbar-expand-lg navbar-light">
            <div class="container">
                <a class="navbar-brand" href="#">
                    <img src="images/lk_logo.png">
                </a>
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#lk_nav"
                    aria-controls="lk_nav" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>

                <div class="collapse navbar-collapse" id="lk_nav">
                    <ul class="navbar-nav mr-auto">
                        <li class="nav-item active">
                            <a class="nav-link" href="#">首页</a>
                        </li>

                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button"
                                data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                学科学习
                            </a>
                            <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                                <a class="dropdown-item" href="#">Web前端+全栈</a>
                                <a class="dropdown-item" href="#">Python+人工智能</a>
                                <div class="dropdown-divider"></div>
                                <a class="dropdown-item" href="#">JavaEE+大数据</a>
                            </div>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#">视频平台 </a>
                        </li>
                        <li class="nav-item ">
                            <a class="nav-link" href="#">软件工具 </a>
                        </li>
                        <li class="nav-item ">
                            <a class="nav-link" href="#">专题学习 </a>
                        </li>
                        <li class="nav-item ">
                            <a class="nav-link" href="#">师资团队</span></a>
                        </li>

                    </ul>

                </div>


            </div>

        </nav>


    </header>
    <!-- -------------头部-end---------------->

    <!-- -------------轮播图-begin------------- -->
    <section id="lk_carousel" class="carousel slide" data-ride="carousel">
        <ol class="carousel-indicators">
            <li data-target="#lk_carousel" data-slide-to="0" class="active"></li>
            <li data-target="#lk_carousel" data-slide-to="1"></li>
            <li data-target="#lk_carousel" data-slide-to="2"></li>
        </ol>
        <div class="carousel-inner">
            <div class="carousel-item active" data-sm-img="images/slide_01_900x410.jpg"
                data-lg-img="images/slide_01_2000x410.jpg"></div>
            <div class="carousel-item" data-sm-img="images/slide_02_900x410.jpg"
                data-lg-img="images/slide_02_2000x410.jpg"></div>
            <div class="carousel-item" data-sm-img="images/slide_03_900x410.jpg"
                data-lg-img="images/slide_03_2000x410.jpg"></div>
        </div>
        <a class="carousel-control-prev" href="#lk_carousel" role="button" data-slide="prev">
            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
        </a>
        <a class="carousel-control-next" href="#lk_carousel" role="button" data-slide="next">
            <span class="carousel-control-next-icon" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
        </a>
    </section>
    <!-- -------------轮播图-end---------------->

    <!-- -------------热门课程-begin------------- -->
    <section id="lk_hot">
        <!-- 标题 -->
        <div class="lk_hot_title">
            <h2><strong>热门课程</strong></h2>
            <img src="./images/star.png">
        </div>
        <!-- 介绍 -->
        <div class="lk_h_intro">
            <div class="container">
                <div class="row">
                    <div class="col-md-6 col-lg-4 mt-3">
                        <div class="lk_h_pic d-flex flex-nowrap">
                            <div class="le ml-2">
                                <img src="./images/wzs.png" alt="">
                            </div>
                            <div class="lk_h_text">
                                <h6><span class="text-danger">【热】</span>
                                    H5+C3从入门到贯通
                                </h6>
                                <p class="text-muted">
                                    8大案例全程驱动教学
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6 col-lg-4 mt-3">
                        <div class="lk_h_pic d-flex flex-nowrap">
                            <div class="le ml-2">
                                <img src="./images/wzs.png" alt="">
                            </div>
                            <div class="lk_h_text">
                                <h6><span class="text-danger">【热】</span>
                                    H5+C3从入门到贯通
                                </h6>
                                <p class="text-muted">
                                    8大案例全程驱动教学
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6 col-lg-4 mt-3">
                        <div class="lk_h_pic d-flex flex-nowrap">
                            <div class="le ml-2">
                                <img src="./images/yjh.png" alt="">
                            </div>
                            <div class="lk_h_text">
                                <h6><span class="text-danger">【热】</span>
                                    H5+C3从入门到贯通
                                </h6>
                                <p class="text-muted">
                                    8大案例全程驱动教学
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6 col-lg-4 mt-3">
                        <div class="lk_h_pic d-flex flex-nowrap">
                            <div class="le ml-2">
                                <img src="./images/gxq.jpg">
                            </div>
                            <div class="lk_h_text">
                                <h6><span class="text-danger">【热】</span>
                                    H5+C3从入门到贯通
                                </h6>
                                <p class="text-muted">
                                    8大案例全程驱动教学
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6 col-lg-4 mt-3">
                        <div class="lk_h_pic d-flex flex-nowrap">
                            <div class="le ml-2">
                                <img src="./images/gxq.jpg" alt="">
                            </div>
                            <div class="lk_h_text">
                                <h6><span class="text-danger">【热】</span>
                                    H5+C3从入门到贯通
                                </h6>
                                <p class="text-muted">
                                    8大案例全程驱动教学
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6 col-lg-4 mt-3">
                        <div class="lk_h_pic d-flex flex-nowrap">
                            <div class="le ml-2">
                                <img src="./images/wzs.png" alt="">
                            </div>
                            <div class="lk_h_text">
                                <h6><span class="text-danger">【热】</span>
                                    H5+C3从入门到贯通
                                </h6>
                                <p class="text-muted">
                                    8大案例全程驱动教学
                                </p>
                            </div>
                        </div>
                    </div>



                </div>
            </div>
        </div>
    </section>
    <!-- -------------热门课程-end---------------->

    <!-- -------------tab栏列表-begin------------- -->
    <section id="lk_tablis">
        <div class="container">
            <div class="row">
                <div class="tab">
                    <div>
                        <ul class="nav nav-tabs d-flex justify-content-center align-items-center" id="myTab" role="tablist">
                            <li class="nav-item" role="presentation">
                                <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab"
                                    aria-controls="home" aria-selected="true">在线大学</a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a class="nav-link" id="profile-tab" data-toggle="tab" href="#home" role="tab"
                                    aria-controls="profile" aria-selected="false">会员专享</a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a class="nav-link" id="messages-tab" data-toggle="tab" href="#settings" role="tab"
                                    aria-controls="messages" aria-selected="false">优质视频</a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a class="nav-link" id="settings-tab" data-toggle="tab" href="#home" role="tab"
                                    aria-controls="settings" aria-selected="false">线下沙龙</a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a class="nav-link" id="settings-tab" data-toggle="tab" href="#settings" role="tab"
                                    aria-controls="settings" aria-selected="false">精品课堂</a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a class="nav-link" id="settings-tab" data-toggle="tab" href="#home" role="tab"
                                    aria-controls="settings" aria-selected="false">撩课小册</a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a class="nav-link" id="settings-tab" data-toggle="tab" href="#home" role="tab"
                                    aria-controls="settings" aria-selected="false">面试宝典</a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a class="nav-link" id="settings-tab" data-toggle="tab" href="#settings" role="tab"
                                    aria-controls="settings" aria-selected="false">小撩阅读</a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a class="nav-link" id="settings-tab" data-toggle="tab" href="#messages" role="tab"
                                    aria-controls="settings" aria-selected="false">小撩公益</a>
                            </li>
                        </ul>
                    </div>
                    <div class="tab-content">
                        <div class="tab-pane active" id="home" role="tabpanel" aria-labelledby="home-tab">
                            <div class="container">
                                <div class="row">
                                    <div class="col-md-8">
                                        <span class="lk_pro_more">
                                            <i class="lk_pro_pic">
                                                <img src="./images/ewm_lk.jpg">
                                            </i>
                                            <p>更多资讯欢迎</p>
                                            <p>关注撩课学院</p>
                                        </span>
                                        <span class="lk_pro_text">
                                            <strong>HTML5+全栈 / Python+人工智能 / JavaEE+大数据</strong>
                                        </span>
                                        <span class="welcome">
                                            <h1>
                                                <strong>
                                                    欢迎来到IT人的在线大学 /
                                                    撩课学院
                                                </strong>
                                            </h1>
                                        </span>
                                        <span>
                                            <a class="btn btn-primary" href="#">课程咨询</a>
                                            <a class="btn" href="#">了解更多</a>
                                        </span>
                                    </div>
                                    <div class="col-md-4 d-none d-sm-none d-md-none d-lg-block">
                                        <img src="./images/iphoneX.png" alt="" width="80%">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="tab-pane" id="settings" role="tabpanel" aria-labelledby="profile-tab">
                            <div class="container">
                                <div class="row">
                                    <div class="col-md-4 d-flex justify-content-center">
                                        <img src="./images/iphoneX2.png" width="80%">
                                    </div>
                                    <div class="col-md-8 huiyuan d-none d-sm-none d-md-none d-lg-block">
                                        <h1 class="text-warning">撩课学院会员</h1>
                                        <p class="lead">
                                            汇聚名师, 为你呈现前端、后端、移动端、大数据、人工智能等从零基础到项目实战连载课程内容。专属的会员社群和私人订制服务,
                                            1年365天持续更新课程紧跟前沿技术!
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>



                    </div>

                </div>
            </div>
        </div>
    </section>
    <!-- -------------tab栏列表-end---------------->

    <!-- -------------关于我们-begin------------- -->
    <section id="lk_about">
        <div class="ab_title">
            <div class="ab_me text-center">
                <h2><strong>关于我们</strong></h2>
                <img src="./images/star.png">
            </div>
        </div>
        <div class="lk_a_text mb-5">
            <div class="container">
                <div class="row">
                    <div class="col-md-8">
                        <p class="text-muted">在短短不到一年的时间， 接近10万多名学生报名参加学习了这些课程, 好评如潮。为了有组织的推出更加全面、优质、成体系的课程，撩课学院应运而生。
                        </p>
                        <P class="text-muted">撩课学院课程体系完善，包含HTML5+全栈开发、Python+人工智能、JavaEE、Go语言+区块链、UI/UE设计、新媒体、电商运营等系列课程。
                        </P>
                        <p class="text-muted">撩课学院课程体系完善，包含HTML5+全栈开发、Python+人工智能、JavaEE、Go语言+区块链、UI/UE设计、新媒体、电商运营等系列课程。
                        </p>
                    </div>
                    <div class="col-md-4">
                        <div class="lk_ab_ic">
                            <img src="./images/team.jpg" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </section>
    <!-- -------------关于我们-end---------------->

    <!-- -------------友情链接-begin------------- -->
    <section id="lk_link">
        <div class="uou text-center d-none d-lg-block">
            <h1><strong>友情链接</strong></h1>
            <img src="./images/star.png">
        </div>
        <div class="lk_link_icon d-none d-lg-block">
            <div class="container">
                <div class="row d-flex justify-content-around align-items-center">
                    <a href="#"><img src="./images/ibm-logo.png"></a>
                    <a href="#"><img src="./images/facebook-logo.png"></a>
                    <a href="#"><img src="./images/google-logo.png"></a>
                    <a href="#"><img src="./images/airbnb-logo.png"></a>
                    <a href="#"><img src="./images/swift-logo.png"></a>
                    <a href="#"><img src="./images/paypal-logo.png"></a>
                    <a href="#"><img src="./images/walmart-logo.png"></a>
                    <a href="#"><img src="./images/airbnb-logo.png"></a>
                    <a href="#"><img src="./images/swift-logo.png"></a>
                </div>
            </div>
        </div>
    </section>
    <!-- -------------友情链接-end---------------->

    <!-- -------------底部-begin-------------  -->
    <footer id="lk_footer">
        <div class="container">
            <div class="row">
                <div class=" col-md-4 d-flex flex-nowrap f_lis justify-content-around align-items-center">
                    <div class="lo d-none d-lg-block">
                        <p><a href="#">关于我们</a></p>
                        <p><a href="#">课程介绍</a></p>
                        <p><a href="#">热门课程</a></p>
                    </div>
                    <div class="le d-none d-lg-block">
                        <p>
                            <a href="#">
                                名师授课
                            </a>
                        </p>
                        <p><a href="#"> 课堂互动</a></p>
                        <p><a href="#">联系我们</a></p>
                    </div>
                </div>
                <div class="col-md-4 text-center d-flex align-items-center justify-content-center">
                    <div class="f-cen ">
                        <span><strong>公司地址: 上海市松江区松江大学城</strong></span>
                        <h6>联系电话: 六个六</h6>
                        <h6>地址邮箱: admin@itlike.com</h6>
                    </div>
                </div>
                <div class="col-md-4  d-flex justify-content-center align-items-center">
                    <div class="f_icon d-none d-sm-none d-md-block d-lg-block">
                        <h5>联系我们:</h5>
                        <span><img src="./images/weixin-h.png" alt=""><img src="./images/xinlang-h.png" alt=""
                                style="margin-left: 5px;"></span>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <!-- -------------底部-end---------------->
    <script src="lib/js/jquery-3.3.1.js"></script>
    <script src="lib/js/popper.js"></script>
    <script src="lib/js/bootstrap.js"></script>
    <script src="js/index.js"></script>
</body>

</html>